<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>菜单设置</title>
    <style>
        .card {
            padding: 15px;
        }
    </style>
</head>
<body>
<div class="layui-fluid vue-box">
    <div class="layui-card card">
        <table class="layui-table">
            <h4>轮播&nbsp;&nbsp;&nbsp;&nbsp;<button @click="openAdd('carousel')" class="layui-btn">新增</button>
            </h4>
            <tr>
                <th>标题</th>
                <th>图片</th>
                <th>链接</th>
                <th>操作</th>
            </tr>
            <tr v-for="(item,index) in that.carousel">
                <td>{{item.title}}</td>
                <td>{{item.icon}}</td>
                <td>{{item.href}}</td>
                <td>
                    <button class="layui-btn" @click="updateAdd('carousel',index)">修改</button>
                    <button class="layui-btn layui-btn-danger" @click="deleteNote('carousel',index)">删除</button>
                </td>
            </tr>
        </table>
        <table class="layui-table">
            <h4>头部导航&nbsp;&nbsp;&nbsp;&nbsp;<button class="layui-btn" @click="openAdd('navigation')">新增</button>
            </h4>
            <tr>
                <th>标题</th>
                <th>图片</th>
                <th>链接</th>
                <th>操作</th>
            </tr>
            <tr v-for="(item,index) in that.navigation">
                <td>{{item.title}}</td>
                <td>{{item.icon}}</td>
                <td>{{item.href}}</td>
                <td>
                    <button class="layui-btn" @click="updateAdd('navigation',index)">修改</button>
                    <button class="layui-btn layui-btn-danger" @click="deleteNote('navigation',index)">删除</button>
                </td>
            </tr>
        </table>
        <table class="layui-table">
            <h4>板块&nbsp;&nbsp;&nbsp;&nbsp;<button class="layui-btn" @click="openAdd('plate')">新增</button>
            </h4>
            <tr>
                <th>标题</th>
                <th>链接</th>
                <th>商品分类ID</th>
                <th>操作</th>
            </tr>
            <tr v-for="(item,index) in that.plate">
                <td>{{item.title}}</td>
                <td>{{item.href}}</td>
                <td>{{item.icon}}</td>
                <td>
                    <button class="layui-btn" @click="updateAdd('plate',index)">修改</button>
                    <button class="layui-btn layui-btn-danger" @click="deleteNote('plate',index)">删除</button>
                </td>
            </tr>
        </table>
    </div>
    <div id="admins" style="display: none;padding-right: 20px;">
        <br>
        <form class="layui-form" action="">
            <div class="layui-row">
                <div class="layui-col-md6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">标题</label>
                        <div class="layui-input-block">
                            <input type="text" v-model="thatNew.title" name="title" placeholder="标题" autocomplete="off"
                                   class="layui-input">
                        </div>
                    </div>
                </div>
                <div class="layui-col-md6">
                    <div class="layui-form-item">
                        <label class="layui-form-label">链接</label>
                        <div class="layui-input-block">
                            <input type="text" v-model="thatNew.href" name="href" placeholder="链接" autocomplete="off"
                                   class="layui-input">
                        </div>
                    </div>
                </div>
                <div class="layui-col-md12" v-if="type=='plate'">
                    <div class="layui-col-md6">
                        <div class="layui-form-item">
                            <label class="layui-form-label">分类id</label>
                            <div class="layui-input-block">
                                <input type="text" v-model="thatNew.icon" name="icon" placeholder="分类id" autocomplete="off"
                                       class="layui-input">
                            </div>
                        </div>
                    </div>
                </div>
                <div class="layui-col-md12" v-if="type!='plate'">
                    <div class="layui-form-item">
                        <div class="layui-col-md12">
                            <label class="layui-form-label">商品图片</label>
                            <a class="layui-btn" id="uploads">
                                上传图片
                            </a>
                        </div>
                        <div v-if="thatNew.icon != ''" class="layui-input-block">
                            <img v-bind:src="thatNew.icon" style="width: 100px;margin: 0 auto">
                            <a @click="delNote" type="button" class="layui-btn layui-btn-sm layui-btn-danger">
                                删除
                            </a>
                        </div>
                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
<script type="text/javascript" th:src="@{/js/require.js}"></script>
<script type="text/javascript" th:src="@{/js/requireConfig.js}"></script>
<script type="text/javascript" th:src="@{/app/admin/setting/index.js}"></script>
</body>
</html>